(function(w){
    var opt = {
        getDoms : function(){
          this.doms = {
              time : $('.time'),
              MyPai : $('.MyPai'),
              leftPais : $('.leftPais'),
              RightPais : $('.RightPais'),
              mplay : $('.mplay'),
              MyPais : $('.MyPais'),
              audio : $('#audio')
          }
        },
        init : function(){
            var _self = this;
            _self.getDoms();
            _self.addEvent();
            _self.time();
            _self.clearStorage();
            var wsServer ='ws://192.168.0.199:9502';  //地址
            var ws = new WebSocket(wsServer); //监听链接
            ws.onopen = function (evt) {  //测试链接成功或失败
                //websocket.readyState 属性：
                switch (ws.readyState) {
                    case 0: console.log('通信服务未打开');break;
                    case 1: console.log('连接成功');break;
                    case 2: console.log('通信端口关闭，无法连接');break;
                    case 3: console.log('通信服务已关闭');break;
                }
                ws.send('s');
            };

            ws.onmessage = function (evt) { //返回数据
                _self.templateMy(_self,evt.data);
                _self.templateMyOne(_self,evt.data);
                _self.templateLeft(_self,evt.data);
                _self.templateRight(_self,evt.data);
            };

        },
        addEvent : function(){
            var _self = this;
            _self.doms.MyPais.delegate('li','click',function(){   //摸进来的牌
                var s = this;  //点击的this
                if($(this).css('top')=='-20px'){
                    _self.chupai($(this));
                    setTimeout(function(){
                        _self.removePai(s,_self);
                        _self.setWidth();
                    },700);
                }else{
                    _self.doms.MyPai.find('li').animate({
                        marginTop : 0
                    });
                    _self.MyTop($(this),1);
                }
            });
            _self.doms.MyPai.delegate('li','click',function(){  //本来的牌
                var s = this;  //点击的this
                if($(this).css('marginTop')=='-20px'){
                        _self.chupai($(this));
                    setTimeout(function(){
                        _self.removePai(s,_self);
                        _self.setWidth();
                    },700);

                }else{
                    _self.doms.MyPais.find('li').animate({
                        top : 0
                    });
                    $(this).siblings().animate({
                        marginTop:0
                    });
                    _self.MyTop($(this));
                }
            })
        },
        templateMy : function(_self,data){  //  My的模板
            _self.doms.MyPai.html('');
            var data = JSON.parse(data);
            var text = '';
            data = _self.srot(data);
            for(var i=0;i<data.playlist.my.length-1;i++){
                text += '<li data="'+data.playlist.my[i].type+'-'+data.playlist.my[i].cate+'">' +
                       '<img src="../imgs/'+data.playlist.my[i].type+'-'+data.playlist.my[i].cate+'.png" alt=""/>' +
                       '</li>'
            }
            _self.doms.MyPai.append(text);
        },
        templateMyOne : function(_self,data){  //  摸进来的牌
            _self.doms.MyPais.html('');
            var data = JSON.parse(data);
            var text = '';
                text += '<li data="'+data.playlist.my[0].type+'-'+data.playlist.my[0].cate+'">' +
                    '<img src="../imgs/'+data.playlist.my[0].type+'-'+data.playlist.my[0].cate+'.png" alt=""/>' +
                    '</li>'
            _self.doms.MyPais.append(text);
        },
        templateLeft : function(_self,data){  //左边的牌模板
            _self.doms.leftPais.html('');
            var data = JSON.parse(data);
            var text = '';
            for(var i=0;i<data.playlist.left.length;i++){
                text += '<li class="leftPai">' +
                        '<img src="../imgs/pai_left.png" alt=""/>' +
                        '</li>'
            }
            _self.doms.leftPais.append(text);
        },
        templateRight : function(_self,data){ //右边的牌
            _self.doms.RightPais.html('');
            var data = JSON.parse(data);
            var text = '';
            for(var i=0;i<data.playlist.right.length;i++){
                text += '<li class="RightPai">' +
                    '<img src="../imgs/pai_Right.png" alt=""/>' +
                    '</li>'
            }
            _self.doms.RightPais.append(text);
        },
        time : function(){   //倒计时
            var _self = this;
            var initTime = _self.doms.time.html();
            var clearTime = setInterval(function(){
                initTime--;
                if(initTime<10){
                    _self.doms.time.css('marginLeft','-5.5px')
                }
                if(initTime<0){
                    clearInterval(clearTime);
                }else{
                _self.doms.time.html(initTime);
                }
            },1000)
        },
        MyTop : function(obj,v){   //点击第1下的时候移出去
            if(v){
                obj.animate({
                   top: '-20px'
                },100)
            }else {
                obj.animate({
                    marginTop: '-20px'
                }, 100)
            }
        },
        chupai : function(obj){   //点击第二下的时候移出去
            obj.animate({
                  marginTop : '-100px',
                  opacity : '0'
            });
        },
        removePai : function(obj,_self){ //点击第二下的时候删除
            _self.storage($(obj).attr('data'));
            obj.remove();
            var storageVal = _self.getStorage();
            _self.palySize(storageVal,_self);
            var audio = _self.doms.audio.attr('src');  //音频
            audio = audio.replace('null','10');
            _self.doms.audio.attr('src',audio);
        },
        setWidth : function(){
            var _self = this;
            _self.doms.MyPai.css('marginLeft','-'+_self.doms.MyPai.find('li').length*6/2+'%')
        },
        storage : function(val){   //储牌到本地
            var jsonList = localStorage.getItem("jsonList");
            if(jsonList != undefined && jsonList!='undefined') {
                var jsonList = JSON.parse(jsonList);
                jsonList.push(val);
                var jsonList = JSON.stringify(jsonList);
                localStorage.setItem("jsonList", jsonList);
            }else{
                var jsonList = new Array();
                jsonList.push(val);
                var j = JSON.stringify(jsonList);
                localStorage.setItem("jsonList",j);
            }
        },
        getStorage : function(){  //读取本地数据
            var jsonList = localStorage.getItem("jsonList");
            jsonList = JSON.parse(jsonList);
            return jsonList
        },
        palySize : function(val,_self){
            _self.doms.mplay.html('');
            var text = '';
            for(var i=0;i<val.length;i++){
                text += '<li>' +
                       '<img src="../imgs/'+val[i]+'.png" alt=""/>' +
                       '</li>'
            }
            _self.doms.mplay.append(text);
        },
        clearStorage : function(){ //清空本地存储
            localStorage.setItem("jsonList",'undefined');
        },
        srot : function(arr){ //排序
            for(var i=0;i<arr.playlist.my.length;i++){
                for(var j=i+1;j<arr.playlist.my.length;j++){
                    if(arr.playlist.my[i].type> arr.playlist.my[j].type){
                        arr.playlist.my[j] = arr.playlist.my.splice(i,1,arr.playlist.my[j])[0];
                    }
                }
            }
            for(var i=0;i<arr.playlist.my.length;i++){
                for(var j=i+1;j<arr.playlist.my.length;j++){
                    if(arr.playlist.my[i].type == arr.playlist.my[j].type){
                        if(arr.playlist.my[i].val > arr.playlist.my[j].val){
                            arr.playlist.my[j] = arr.playlist.my.splice(i,1,arr.playlist.my[j])[0];
                        }
                    }
                }
            }
            return arr;
        }
    };
    opt.init();

})(window);